import tinymce from 'tinymce';

// 上标
let superscript = "⁰ ¹ ² ³ ⁴ ⁵ ⁶ ⁷ ⁸ ⁹" +
    " ᵃ ᵇ ᶜ ᵈ ᵉ ᵍ ʰ ⁱ ʲ ᵏ ˡ ᵐ ⁿ ᵒ ᵖ ᵒ ʳ ˢ ᵗ ᵘ ᵛ ʷ ˣ ʸ ᙆ" +
    " ᴬ ᴮ ᒼ ᴰ ᴱ ᴳ ᴴ ᴵ ᴶ ᴷ ᴸ ᴹ ᴺ ᴼ ᴾ ᴼ ᴿ ˢ ᵀ ᵁ ᵂ ˣ ᵞ ᙆ" +
    " ⁺ ⁻ ⁼ ˂ ˃ ⁽ ⁾ ˙ * º ᵎ ᶲ" +
    " ᵅ ᵝ ᵞ ᵟ ᵋ ᶼ ᵑ ᶿ ᶥ ᶺ ᘁ ᐤ ᣖ ᶹ ᵠ ᵡ ᐜ" +
    " ᶛ ᵄ ᵆ ᵊ ᵌ ᶦ ᶨ ᶩ ᵓ ᶴ ᶱ ᶞ ᶸ ᶷ ᶾ" +
    " ᵔ ᵕ ᵙ ᵜ ᶜ ᶝ ᶟ ᶡ ᶣ ᶧ ᶤ ᶪ ᶫ ᶬ ᶭ ᶮ ᶯ ᶰ ᶳ ᶵ ᶶ ᵚ ᶽ" +
    " ჼ ꚜ ꚝ ᒃ ᕻ ᑦ ᒄ ᕪ ᑋ ᑊ ᔿ ᐢ ᣕ ᣴ ᣗ ᔆ ᙚ ᐡ ᕽ ᙆ ᙇ ᒼ ᣳ ᒢ ᒻ ᔿ ᐪ" +
    " ꝰ ˀ ˁ ˤ ꟸ ꭜ ʱ ꭝ ꭞ ʴ ʵ ʶ ꭟ ˠ ꟹ ᴭ ᴯ ᴲ ᴻ ᴽ"

// 下标
let subscript = '₀ ₁ ₂ ₃ ₄ ₅ ₆ ₇ ₈ ₉' +
    ' ₊ ₋ ₌ ₍ ₎' +
    ' ₐ ₔ ₑ ₕ ᵢ ⱼ ₖ ₗ ₘ ₙ ₒ ₚ ᵣ ₛ ₜ ᵤ ᵥ ₓ' +
    ' ᵦ ᵧ ៴ ₒ ᵨ ᵩ ᵪ' +
    ' ₗ ˪ ៳ ៷ ᙮'

// 中文上标
let chineseSuperscript = '㆒ ㆓ ㆔ ㆕ ㆖ ㆗ ㆘ ㆙ ㆚ ㆛ ㆜ ㆝ ㆞ ㆟';

// 化学用例
let chemicalUseCases = 'H₂ CO₂ C₂ H₄ O₂' +
    ' O²⁻ H⁺ Fe²⁺ Al³⁺ Cl⁻';

// 空格分隔的数据转tinymce 弹层数据的 items
function getSymbolsItem(str) {
    let symbolsArray = str.split(" ");
    let items = [];
    let symbols = [];
    for (const symbol of symbolsArray) {
        if (symbols.includes(symbol)) {
            continue
        }
        symbols.push(symbol)
        items.push({text: 'button', value: symbol, icon: symbol})
    }
    return items;
}

// 初始数据
var initialData = {
    subscript: getSymbolsItem(subscript),
    superscript: getSymbolsItem(superscript),
    chineseSuperscript: getSymbolsItem(chineseSuperscript),
    chemicalUseCases: getSymbolsItem(chemicalUseCases),
};

tinymce.PluginManager.add('customSymbols', function (editor) {
    editor.ui.registry.addButton('customSymbols', {
        text: 'ᴴₕʰ',
        onAction: function () {
            editor.windowManager.open({
                title: '特殊字符新',
                size: 'normal',
                body: {
                    type: 'tabpanel',
                    tabs: [
                        {
                            title: "上标",
                            name: '上标',
                            items: [
                                {
                                    type: 'collection',
                                    name: 'superscript',
                                }
                            ]
                        },
                        {
                            title: "下标",
                            name: '下标',
                            items: [
                                {
                                    type: 'collection',
                                    name: 'subscript',
                                }
                            ]
                        }, {
                            title: "中文上标",
                            name: '中文上标',
                            items: [
                                {
                                    type: 'collection',
                                    name: 'chineseSuperscript',
                                }
                            ]
                        }, {
                            title: "化学用例",
                            name: '化学用例',
                            items: [
                                {
                                    type: 'collection',
                                    name: 'chemicalUseCases',
                                }
                            ]
                        },
                    ]
                },
                initialData: initialData,
                buttons: [
                    {
                        text: 'Close',
                        type: 'cancel',
                        onclick: 'close'
                    }
                ],
                onAction(dialogApi, details) {
                    console.log(details.name + "-" + details.value)
                    editor.insertContent(details.value);
                    editor.windowManager.close();
                }
            });
        }
    });
});

